import classs from './TodoList.module.scss'
const ChannelLevel = (props) => {
    const handlLevel = (index, type) => {
        console.log('prop', props)
        let arr = [...props.todoList]
        if (index === 0 && type === 'up') {
            alert('已经是优先级最顶层了')
            
        } else {
            if (index === props.todoList.length - 1 && type === 'down') {
                alert('当前优先级已经是最后面了')
            } else {
                console.log('start',arr, index)
                if (type === 'down') {
                    arr[index] = arr.splice(index + 1, 1, arr[index])[0] 
                } else {
                    arr[index] = arr.splice(index-1, 1, arr[index])[0]
                }
                // 交换后更新todolist
                props.setTodo(arr)
            }
        }
        
    }
    return (<div className={classs.levelOn}>
        {props.index === 0 ? null : (<span onClick={() => handlLevel(props.index, 'up')}>↑
        </span>)}
        {props.index === props.todoList.length - 1 ? null : (<span onClick={() => handlLevel(props.index, 'down')}>↓</span>)}

    </div>);
}

export default ChannelLevel;